<template>
	<div class="frame-page h-panel">
		<div class="h-panel-bar">
			<span class="h-panel-title">类目设置</span>
			<div class="h-panel-right">
				<Button color="primary" @click="doEdit(0)"><span class="icon tianjia1"></span> 新增类目</Button>
			</div>
		</div>
		<div class="h-panel-body">
			<Table :loading="loading" :datas="$global.array2Tree(datas)">
				<TableItem :width="80" prop="id" align="center" title="编号"></TableItem>
				<TableItem :width="150" prop="name" title="名称" treeOpener></TableItem>
				<TableItem :width="150" align="center" title="产品表单">
					<template slot-scope="{data}">
						{{data.form_id>0 ? $global.getArrayName($global.config.forms,data.form_id) : '无'}}
					</template>
				</TableItem>
				<TableItem :width="150" align="center" title="订单表单">
					<template slot-scope="{data}">
						{{data.order_form_id>0 ? $global.getArrayName($global.config.forms,data.order_form_id) : '无'}}
					</template>
				</TableItem>
				<TableItem :width="100" prop="rank" align="center" title="权重"></TableItem>
				<TableItem :width="150" align="center" title="修改时间">
					<template slot-scope="{data}">
						{{$global.getDateTime(data.update_time)}}
					</template>
				</TableItem>
				<TableItem :width="150" align="center" title="创建时间">
					<template slot-scope="{data}">
						{{$global.getDateTime(data.create_time)}}
					</template>
				</TableItem>
				<TableItem :width="100" align="center" title="操作" fixed="right">
					<template slot-scope="{data}">
						<button class="h-btn h-btn-s h-btn-blue" title="编辑" @click="doEdit(data.id)"><i class="icon bianji"></i></button>
						<button class="h-btn h-btn-s h-btn-red" title="删除" @click="doDelete(data.id)"><i class="icon shanchu"></i></button>
					</template>
				</TableItem>
			</Table>
		</div>
		<Modal v-model="openEdit" :closeOnMask="false">
			<Edit @close="openEdit=false" :id="id" :cate="datas"></Edit>
		</Modal>
	</div>
</template>

<script>
import Edit from './edit';
export default {
	components : {
		Edit
	},
	data() {
		return {
			id : 0,
			openEdit : false,
			datas: [],
			loading: false
		};
	},
	mounted() {
		this.getData()
	},
	methods: {
		async getData() {
			this.loading = true
			this.datas = await this.$api('GET','cate')
			this.loading = false
		},
		doEdit (id){
			this.id = id
			this.openEdit = true
		},
		async doDelete (id,istrue=false){
			if(istrue){
				let res = 0
				res = await this.$api('DELETE','cate/'+id)
				if(res){
					this.datas.forEach((item,index) => {
						if(item.id == id){
							this.datas.splice(index,1)
						}
					})
				}
			}else{
				this.$Confirm('确定删除？').then(() => {
					this.doDelete(id,true)
				}).catch(() => {})
			}
		}
	}
};
</script>

<style lang='less'>
	.tableele{
		margin: 1px;
	}
</style>